import useDebounce from "@/utils/debounce";
import { Table } from "antd";
import { memo, useEffect, useRef, useState } from "react";
interface IProps {
  dataSource: any[];
  columns: any[];
  x?: number;
  y?: number;
  defaultOptions?: any[];
  defaultSize?: number;
  clasNames?: string;
  setSelectKeys?: (v: any) => void;
  rowSelection?: any;
}
export default memo(function LHJTable(props: IProps) {
  const [scroll, setScroll] = useState({ x: 1200, y: 300 });
  const handleResize = () => {
    // 根据窗口大小等条件动态计算滚动配置
    const newX = props.x ?? 2200;
    const cf = document.querySelector(".custom-form")?.clientHeight ?? 0;
    const hh = document.querySelector(".home-header")?.clientHeight ?? 0;
    let newY = window.innerHeight - 130 - cf - hh;
    newY < 500 ? (newY += 200) : newY;
    setScroll({ x: newX, y: newY });
  };
  useEffect(() => {
    handleResize();
    const d = useDebounce(handleResize);
    // 添加事件监听器
    window.addEventListener("resize", d);
    // 在组件卸载时移除事件监听器
    return () => {
      window.removeEventListener("resize", d);
    };
  }, [props]); // 空数组表示只在组件挂载和卸载时执行
  return (
    <div className={props.clasNames}>
      {/*<div onClick={() => handleResize()}>设置高度</div>*/}
      <Table
        className={"w-full"}
        scroll={scroll}
        rowSelection={props.rowSelection}
        // rowSelection={{
        //     type: "checkbox",
        //     selections: true,
        //     onChange: (selectedRowKeys) => {
        //       props.setSelectKeys(selectedRowKeys)
        //     }
        // }}
        pagination={{
          pageSizeOptions: [20, 50, 100, 150],
          defaultPageSize: 20,
        }}
        bordered
        dataSource={props.dataSource}
        columns={props.columns}
      />
    </div>
  );
});
